<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
		<script src="https://printjs-4de6.kxcdn.com/print.min.js"></script>
		<link rel="stylesheet" href="https://printjs-4de6.kxcdn.com/print.min.css" />
	</head>

	<body>
		<div id="printJS-form"></div>
	</body>
	<script>
		let someJSONdata = [
			{
				name: 'John Doe',
				email: 'john@doe.com',
				phone: '111-111-111',
				sex: '难',
				price: 20,
				class: '火狐谷歌edge',
			},
			{
				name: 'Barry Allen',
				email: 'barry@flash.com',
				phone: '222-222-2222',
				sex: '难',
				price: 20,
				class: '火狐谷歌edge',
			},
			{
				name: 'Cool Dude',
				email: 'cool@dude.com',
				phone: '333-333-3333',
				sex: '难',
				price: 20,
				class: '火狐谷歌edge',
			},
		]
		let arr = []
		for (let index = 0; index < 500; index++) {
			arr = arr.concat(someJSONdata)
		}
		console.log(arr)
		console.log(
			printJS({
				printable: arr,
				properties: ['name', 'email', 'phone', 'sex', 'price', 'class'],
				header: '<h3 class="custom-h3">My custom header</h3>',
				repeatTableHeader: false,
				type: 'json',
                style:'body { border-bottom: 1px solid #3971A5 }',
				gridHeaderStyle: 'color: red;  border-top: 2px solid #3971A5;border-bottom: 2px solid #3971A5;height:50px',
				gridStyle: '',
				onLoadingStart: () => {
					console.log('Start')
				},
				onLoadingEnd() {
					console.log('end')
				},
			})
		)
	</script>
</html>
